body {
  background-color: #ebe7d9;
  font-family: "Montserrat", sans-serif;
  font-size: 18px;
}
.container {
  max-width: 980px;
  width: 100%;
  text-align: center;
}

/* Kendi Fotoğrafım */
.fotograf {
  margin-top: 50px;
  margin-bottom: 50px;
  width: 300px;
  border-radius: 50%;
}
/* /Kendi Fotoğrafım */

/* Hakkımda İçeriği */
.hakkımda {
  margin-left: auto;
  margin-right: auto;
  width: 83%;
  font-size: 1.2rem;
  font-family: "Roboto", sans-serif;
  margin-bottom: 100px;
}
/* /Hakkımda İçeriği */

.wrapper {
  display: flex;
  justify-content: center;
}

.wrapper .button {
  display: inline-block;
  height: 70px;
  width: 70px;
  margin: -30px 5px 40px 5px;
  overflow: hidden;
  background: #fff;
  border-radius: 50px;
  cursor: pointer;
  box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease-out;
}

.wrapper .button .icon {
  display: inline-block;
  height: 70px;
  width: 70px;
  text-align: center;
  border-radius: 50px;
  box-sizing: border-box;
  line-height: 80px;
  transition: all 0.3s ease-out;
}
.wrapper .button:nth-child(1):hover .icon {
  background: #525659;
}
.wrapper .button:nth-child(2):hover .icon {
  background: #ea4335;
}
.wrapper .button:nth-child(3):hover .icon {
  background: #0b65c2;
}
.wrapper .button:nth-child(4):hover .icon {
  background: #161b22;
}

.wrapper .button .icon i {
  color: black;
  font-size: 31px;
  line-height: 60px;
  transition: all 0.3s ease-out;
}
.wrapper .button:hover .icon i {
  color: #fff;
}

.wrapper .button:nth-child(1) span a {
  color: #525659;
}
.wrapper .button:nth-child(2) span a {
  color: #ea4335;
}
.wrapper .button:nth-child(3) span a {
  color: #0b65c2;
}
.wrapper .button:nth-child(4) span a {
  color: #161b22;
}